<!DOCTYPE html>
<script src="../../../resources/js-test.js"></script>
<style>
#full, #ancestor {
    background-color: red;
}

.t1 #full:-webkit-full-screen,
.t2 #ancestor:-webkit-full-screen-ancestor {
    background-color: green;
}
</style>
<div id="testRoot">
    <div id="ancestor">
        <div id="full">
            <div></div>
        </div>
        <div></div>
    </div>
    <div></div>
    <div></div>
</div>
<script>
description("Test that descendant invalidation works with fullscreen pseudo classes.");

window.jsTestIsAsync = true;

var red = "rgb(255, 0, 0)";
var green = "rgb(0, 128, 0)";

function runTests() {

    shouldBe("getComputedStyle(full).backgroundColor", "red");
    testRoot.offsetTop; // force recalc
    testRoot.className = "t1";
    if (window.internals)
        shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "2");
    shouldBe("getComputedStyle(full).backgroundColor", "green");

    shouldBe("getComputedStyle(ancestor).backgroundColor", "red");
    testRoot.offsetTop; // force recalc
    testRoot.className += " t2";
    if (window.internals)
        shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "1");
    shouldBe("getComputedStyle(ancestor).backgroundColor", "green");

    finishJSTest();
}

if (window.testRunner)
    testRunner.waitUntilDone();

document.addEventListener("keypress", function(){
    document.getElementById("full").webkitRequestFullScreen();
});

document.addEventListener("webkitfullscreenchange", function(){
    runTests();
});

if (window.eventSender)
    eventSender.keyDown(" ");
</script>
